<!doctype html>
<html>
<head>
    <meta charset="utf-8">
</head>
<script src="js/axios.min.js"></script>
<script src="js/vue.min.js"></script>
<!-- 引入样式 -->
<link href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<body>
<div id="app">
    <h4>上传文件</h4>
    <form>
        选择双色球文件：<input name="datafile" type="file"/>
        <button @click.prevent="upload">上&nbsp;&nbsp;传</button>
    </form>
</div>
</body>
<script>
    var v = new Vue({
        el: "#app",
        methods: {
            upload() {
                let url = "upload.s";
                let params = new FormData();
                let file = document.querySelector("form>input");
                params.append("file", file.files[0]);
                axios.post(url, params).then(res => {
                    if (res.data.code == 1) {
                        this.$message(res.data.msg);
                    } else {
                        this.$alert(res.data.msg, '系统提示');
                    }
                });
            }
        }
    });
</script>
</html>

<style>
    html,
    body {
        height: 100%;
        padding: 0px;
        margin: 0px;
        overflow: hidden;
        color: #333;
    }

    #app {
        margin: 50px;
    }

    form {
        text-align: right;
        display: inline-block;
    }

    button {
        padding: 0px 20px;
    }
</style>
